let inp1 = document.querySelector('#p1');
let inp2 = document.querySelector('#p2');
let btn = document.querySelector('#btn-login');
let reg = {
    name: {
        con: /[\u4e00-\u9fa5]{2,6}/,
        error: '请输入正确的昵称'
    },
    pass: {
        con: /^(?=.*[A-Z])(?=.*[!@#$%&*])(?=.*\d).{8,12}$/,
        error: '请输入正确的密码'
    }
}
//校验input框数据
inp1.addEventListener('blur', function () {
    let str = this.value.trim();
    if (str == '') {
        this.parentNode.classList.remove('success');
        this.parentNode.classList.add('error');
        this.nextElementSibling.innerText = reg.name.error;
        return
    }
    if (reg.name.con.test(this.value)) {
        this.parentNode.classList.remove('error');
        this.parentNode.classList.add('success');
    } else {
        this.parentNode.classList.remove('success');
        this.parentNode.classList.add('error');
        this.nextElementSibling.innerText = reg.name.error;
    }
})
inp2.addEventListener('blur', function () {
    let str = this.value.trim();
    if (str == '') {
        this.parentNode.classList.remove('success');
        this.parentNode.classList.add('error');
        this.nextElementSibling.innerText = reg.pass.error;
        return
    }
    if (reg.pass.con.test(this.value)) {
        this.parentNode.classList.remove('error');
        this.parentNode.classList.add('success');
    } else {
        this.parentNode.classList.remove('success');
        this.parentNode.classList.add('error');
        this.nextElementSibling.innerText = reg.pass.error;
    }
})
//给登陆按钮添加点击事件
btn.addEventListener('click', function () {
    if (inp1.value.trim() === "" || inp2.value.trim() === "") {
        let p1 = document.querySelector('.p1')
        p1.innerHTML = '请填完所全部选项';
        p1.style.display = "block";
        return
    }
    if (reg.name.con.test(inp1.value) && reg.pass.con.test(inp2.value)) {
        alert('登陆成功');
        setTimeout(window.location.href = 'home.html',800)
    } else {
        let p1 = document.querySelector('.p1')
        p1.innerHTML = '请输入正确的账号和密码';
        p1.classList.add('p1')
        p1.style.display = "block";
    }
})